<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			.code_box{
				width: 200px;
				height: 200px;
				background-color: #ccc;
				margin: 0 auto;
			}
		</style>
	</head>
	
	<body>

		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">支付</h1>
		</header>
		<div class="mui-content" style="text-align: center;">
			<br />
			<div class="mui-btn mui-btn-primary" id="wx_pay_btn">微信支付</div>
			<div class="mui-btn mui-btn-primary" id="ali_pay_btn">支付宝支付</div>
			<div class="mui-btn mui-btn-primary" id="weixin_login">微信登陆</div>
			<textarea name="" id="info" rows="" cols=""></textarea>

			<div class="mui-btn mui-btn-primary" id="saoma">扫码</div>
			<div class="code_box" id="code_box"></div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/tools/pay.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			document.addEventListener("plusready", function() {
				
				document.getElementById('saoma').addEventListener("tap", function() {
					var scan = null;
					function onmarked(type, result) {
						var text = '未知: ';
						switch(type) {
							case plus.barcode.QR:
								text = 'QR: ';
								break;
							case plus.barcode.EAN13:
								text = 'EAN13: ';
								break;
							case plus.barcode.EAN8:
								text = 'EAN8: ';
								break;
						}
						alert(text + result);
						closeScan()
					}
					startRecognize()
					function startRecognize() {
						scan = new plus.barcode.Barcode('code_box');
						scan.onmarked = onmarked;
						startScan()
					}
					//开始条码识别
					function startScan() {
						scan.start();
					}
					//结束条码识别
					function cancelScan() {
						scan.cancel();
					}
					//是否开启闪光灯
					function setFlash() {
						scan.setFlash();
					}
					
					function closeScan() {
						scan.close();
					}
					
				})
				
				

				document.getElementById("wx_pay_btn").addEventListener("tap", function() {
					console.log("wx_pay");
					get_pay_channel(function(paylist) {
						// 请求支付操作
						var order_info = {

						}
						get_wx_statement(order_info, function(statement) {
							pay(paylist.wx_pay, statement, function() {
								alert("支付操作成功！");
							})
						})

					})
				})

				document.getElementById("ali_pay_btn").addEventListener("tap", function() {
					console.log("ali_pay");
					get_pay_channel(function(paylist) {
						// 请求支付操作
						var order_info = {

						}
						get_ali_statement(order_info, function(statement) {
							pay(paylist.ali_pay, statement, function() {
								alert("支付操作成功！");
							})
						})

					})
				})

				document.getElementById("weixin_login").addEventListener("tap", function() {
					//获取第三方服务通道
					plus.oauth.getServices(function(services) {
						auths = services;
						//第三方登陆
						authLogin(auths)
					}, function(e) {
						alert("获取分享服务列表失败：" + e.message + " - " + e.code);
					});
					//第三方登陆
					function authLogin(auths) {
						alert(JSON.stringify(auths));
						var s;
						//使用微信通道进行登陆
						for(var i = 0; i < auths.length; i++) {
							if(auths[i].id == "weixin") {
								s = auths[i]
							}
						}

						alert(JSON.stringify(s))
						//如果没有登陆信息 则进行登陆
						if(!s.authResult) {

							s.login(function(e) {
								alert(JSON.stringify(e));
								document.getElementById('info').value = JSON.stringify(e);
								alert("登录认证成功！");
							}, function(e) {
								alert(JSON.stringify(e))

								alert("登录认证失败！");
							});
						} else {
							alert("已经登录认证！");
						}
					}
				})

			})

			mui.init()
		</script>
	</body>

</html>